<template>
	<Layout class="p-5 bg-white">
    <Modal v-model="modal11">
      <img :src="url"/>
    </Modal>
		<Form >
			<h1 style="text-align: center;margin: 20px;">车辆求租</h1>
	 <div class="content">
		<div class="width1190">		
			<form action="#" style="margin-left: 100px;" method="get" class="pro-search">
				<table>
					<tbody>
						<tr>
							<th>标题：</th>
								<td>  
										<Input @on-change="searchCarList()" v-model="car.title" style="width:150px;" placeholder="请输入标题"></Input>
								</td>
								<th>描述：</th>
								<td>  
										<Input @on-change="searchCarList()" v-model="car.details" style="width:150px;" placeholder="请输入描述"></Input>
								</td>
							</tr>

					</tbody>
				</table>		
			</form>	
		</div>			
	</div>				
		 <div>
		 	<!-- <div class="pro-left"> -->
		 		<Card v-for="item in carArray" style="width:400px;margin: 10px;display: inline-block;">
					<div @click="carQiu(item.crId)">
						<h3>{{item.title}}</h3>
						<div class="pra-fang">要求：{{item.details}}</div>
						<div class="pra-fang">发布时间：{{item.ct}}</div>
						<div class="pra-fang">发布人：{{item.personName}}</div>
					</div>
		 		    
		 		</Card>
		 	<!-- </div> -->
		 </div>
		 <div class="clears"></div>
		 <div class="page">
		 	<Page
		 	      :page-size="car.pageSize"
		 	      @on-change="pageSearch"
		 	      :total="car.total"
		 	      :current="car.currentPage" />
		 </div>
		</Form>
	</Layout>
</template>
<script>
	export default {
		data() {
			return {
        iport : '',
        modal11 : false,
        number :10,
        orderInfo : {},
				url:'',
				currentUser:{},
				car:{
					title:"",
					details:'',
					// clientId: '',
					currentPage: null,
					pageSize: null,
					total:null,
				},
				carArray:[],
			}
		},
		methods: {
      getOrderStatu: function () {
        console.log(this.$data.number);
        this.number--;
        if(this.number === 0){
          clearInterval(this.longSearch)
          this.modal11 = false
          this.number = 10
          this.$Notice.error({
            title: '支付超时',
          });
        }
        //发请求查询支付状态
        this.http.get({
          url: "/pay-order/info",
          param: {

            orderNumber:this.orderInfo.orderNumber
          }
        }).then(data => {

          console.log("支付状态" + data);

          if(data == 2) {
            this.modal11 = false
            clearInterval(this.longSearch)


            this.$Notice.success({
              title: '支付成功',
            });

          }
        })

      },
			//求租车详细查询
      carQiu(crId){
        this.car.clientId = JSON.parse(sessionStorage.getItem('CURRENT')).client.clientId;
        console.log(this.car.clientId);
        this.http.get({
          url: "/quotarecord/info",
          param: {
            clientId: this.car.clientId,
            orderTypeId : 16
          }
        }).then(data => {
          if(data.quota +1 > 0){
            this.$router.push({
              name:'car_qiuzu_detail',
              params:{
                crId
              }
            })
          } else{
            let paramm = {};
            this.http.post({
              url:'/pay-order/info',
              param:{
                clientId:this.car.clientId,
                orderTypeId:16
              }
            })
                .then((data) => {
              this.$data.orderInfo = data
              paramm.clientId = this.$data.orderInfo.clientId;
              paramm.orderNumber = this.$data.orderInfo.orderNumber;
              paramm.price = this.$data.orderInfo.price;
              paramm.orderTypeId = this.$data.orderInfo.orderTypeId;
              this.modal11 = true;
              this.url =  this.iport + 'pay/nativeV2?clientId='+paramm.clientId
                  +'&orderTypeId='+paramm.orderTypeId
                  +'&money='+paramm.price
                  +'&orderNumber='+paramm.orderNumber
              this.longSearch = setInterval(this.getOrderStatu,3000)
            })
          }
          console.log(data);
        });

			},
			pageSearch: function(changedPage) {
			  this.$data.car.currentPage = changedPage
			  this.searchCarList(changedPage)
			},
			searchCarList:function(current){
				this.http.get({
					url:'/car-rent-info/page',
					param:{
						title : this.car.title,
						details: this.car.details,
						// clientId: this.car.clientId,
						pageSize: 6,
						currentPage: current
					}
				}).then((data) => {
					this.$data.car.pageSize = data.size,
					this.$data.car.currentPage = data.current,
					this.$data.car.total = data.total
					this.$data.carArray = data.records
					console.log(data)
				})
			},
		},
		created: function() {
			this.$data.currentUser = JSON.parse(sessionStorage.getItem('CURRENT'))
			this.$data.car.clientId = this.$data.currentUser.client.clientId
      this.iport = this.store.state.iport
      this.searchCarList(1)
			
			// var cli = this.local.session.getItem("CURRENT");
			// this.houseSell.clientId = cli.client.clientId;
		},
		beforeRouteLeave(to, from, next) {
		    this.$destroy();//手动销毁当前页面
		    next();
		},
	}
</script>

<style >
</style>
